<template>
  <div class="beds-list">
    <div class="beds-list-header">
      <div class="beds-list-from">
        <DynamicForm ref="dynamicFormRef" type="search" @click="callBack" :rulesForm="state.bedsSearch"
                     :refresh="state.refresh"/>
      </div>
      <div class="beds-list-button">
        <el-button type="primary" @click="()=>{toBedRouter()}">新增</el-button>
      </div>
    </div>
    <div class="beds-list-table">
      <DynamicTable ref="dynamicTableRef"
                    :columns="beds"
                    :table="state.table"
                    :data="state.data"
                    @click="callBack"/>
    </div>
    <DynamicDialog ref="dynamicDialogRef" @click="callBack" :dialogVisible="state.visible"
                   :button="{cancel:false,confirm:false}"
                   title="关联设备">
      <template #dialog>
        <Relation ref="relationRef" @click="callBack" v-if="state.visible" :row="state.row"/>
      </template>
    </DynamicDialog>
  </div>
</template>

<script lang="ts" setup>
import {ref, watch, onMounted, reactive} from 'vue';
import DynamicTable from '@/components/layout/table/dynamic-table.vue';
import DynamicForm from '@/components/layout/form/dynamic-form.vue';
import DynamicDialog from '@/components/layout/dialog/dynamic-dialog.vue';
import Relation from '../relation/Index.vue';

import {bedsColumns} from '@/assets/script/monitor/columns/beds';
import {BedSearchForms} from '@/assets/script/monitor/forms/bed/list-search-form';

import {listConstByDictionaryCodesApi} from '@/api/dictionary';
import {listBmsBedPageApi} from '@/api/bed';
import {useRouter} from 'vue-router';

const dynamicTableRef = ref(DynamicTable)
const dynamicFormRef = ref(DynamicForm)
const dynamicDialogRef = ref(DynamicDialog)
const relationRef = ref(Relation)

const beds = bedsColumns
const router = useRouter()

const state = reactive({
  data: [] as any,
  table: {
    total: 0,
    pageSize: 15,
    pageIndex: 1
  },
  bedsSearch: BedSearchForms,
  storey: [] as any,
  floor: [] as any,
  room: [] as any,
  refresh: 0 as number,
  searchData: {} as any,
  row: {} as any
})

onMounted(() => {
  listConstByDictionaryCodes();
  listBmsBedPage()
})

const callBack = (data: any) => {
  let item: any
  let parent: any
  switch (data.type || '') {
    case 'dialogClose':
      state.visible = false
      break
    case 'storey':
      parent = state.bedsSearch[0].card.find((f: any) => f.name === 'storey')
      parent[parent.name] = data.data
      item = state.bedsSearch[0].card.find((f: any) => f.name === 'floor')
      item.options = []
      item[item.name] = undefined
      // eslint-disable-next-line no-case-declarations
      let floors = state.floor.filter((f: any) => f.parentCode === data.data)
      floors.forEach((e: any) => {
        item?.options?.push({label: e.constName, value: e.constCode})
      })
      state.refresh = Math.random()
      break
    case 'floor':
      parent = state.bedsSearch[0].card.find((f: any) => f.name === 'floor')
      parent[parent.name] = data.data
      item = state.bedsSearch[0].card.find((f: any) => f.name === 'room')
      item.options = []
      item[item.name] = undefined
      // eslint-disable-next-line no-case-declarations
      let rooms = state.room.filter((f: any) => f.parentCode === data.data)
      rooms.forEach((e: any) => {
        item?.options?.push({label: e.constName, value: e.constCode})
      })
      state.refresh = Math.random()
      break
    case 'submit':
      state.searchData = data.data
      if (state.searchData) {
        state.searchData['name'] = state.searchData['bedName']
      }
      listBmsBedPage(state.searchData)
      break
    case 'rest':
      state.searchData = {}
      state.table.pageIndex = 1
      state.table.pageSize = 15
      listBmsBedPage()
      break
    case 'edit':
      router.push({path: '/beds/edit-bed', query: {id: data.data.id}})
      break
    case 'page':
      if (!state.searchData) {
        state.searchData = {}
      }
      state.searchData['pageIndex'] = data.data
      state.searchData['pageSize'] = state.table.pageSize
      state.table.pageIndex = data.data
      listBmsBedPage(state.searchData)
      break
    case 'pageSize':
      if (!state.searchData) {
        state.searchData = {}
      }
      state.searchData['pageIndex'] = state.table.pageIndex
      state.searchData['pageSize'] = data.data
      state.table.pageSize = data.data
      listBmsBedPage(state.searchData)
      break
    case 'relation':
      state.visible = true
      state.row = data.data
      break
    default:
      console.log('callBack', data)
      break
  }
}

const listConstByDictionaryCodes = () => {
  listConstByDictionaryCodesApi(['storey', 'floor', 'room']).then((data: any) => {
    state.storey = data.filter((f: any) => f.dictionaryCode === 'storey')
    const item = state.bedsSearch[0].card.find((f: any) => f.name === 'storey')
    state.storey.forEach((e: any) => {
      item?.options?.push({label: e.constName, value: e.constCode})
    })
    state.floor = data.filter((f: any) => f.dictionaryCode === 'floor')
    state.room = data.filter((f: any) => f.dictionaryCode === 'room')
  })
}

const listBmsBedPage = (params = {pageIndex: 1, pageSize: 15} as any) => {
  listBmsBedPageApi(params).then((data: any) => {
    if (data.code === 0) {
      data.data.forEach((e: any) => {
        e.position = e.storeyName + '>' + e.floorName + '>' + e.roomName
      })
      state.data = data.data
      state.table.total = data.total
      state.table.pageIndex = data.pageIndex
      state.table.pageSize = data.pageSize
    }
  })
}

const toBedRouter = (query: any) => {
  router.push({path: '/beds/add-bed', query})
}

</script>